import 'package:flutter/material.dart';
import 'package:flutter/src/foundation/key.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/widgets.dart';

class SingleChildScrollViewDemo extends StatefulWidget {
  const SingleChildScrollViewDemo({Key? key}) : super(key: key);

  @override
  State<SingleChildScrollViewDemo> createState() => _SingleChildScrollViewDemotate();
}

class _SingleChildScrollViewDemotate extends State<SingleChildScrollViewDemo> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:const Text("SingleChildScrollView使用分析") ,
        centerTitle: true,
      ),
      // 像Row、Column、Flex等有些widget是无法进行滚动的，一旦子控件超出父控件的范围，
      // flutter会发出警告，屏幕会有黄黑色条纹出现，这时我们可以使用滚动控件来进行处理。
      body: SingleChildScrollView(
        // 设置 SingleChildScrollView
        child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        crossAxisAlignment: CrossAxisAlignment.baseline,
        mainAxisSize: MainAxisSize.max,
        textDirection: TextDirection.ltr,
        verticalDirection: VerticalDirection.down,
        textBaseline: TextBaseline.alphabetic,
        children: getContainers(20),
      ),
    )
     
    );
    
  }
  List<Widget> getContainers (int length) {
    // ignore: deprecated_member_use
    List<Widget> list =[];
    for (int i = 0; i < length; i++) {
      list.add(Container(
        width: double.infinity,
        height: 50.0,
        margin: EdgeInsets.only(top: 10.0),
        color: Colors.lightBlueAccent,
      ));
    }
    return list;
  }

}